<template>
	<view style="padding-bottom: 120rpx;">
		<view class="top-box d-between">
			<view class="d-flex">
				<text class="iconfont" style="color: #FF9344;font-size: 50rpx;">&#xe640;</text>
				<view class="address one-line">{{address_name}}-{{address}}</view>
				<!-- <u-icon style="padding-left: 10rpx;" name="arrow-right"></u-icon> -->
			</view>

			<!-- <view class="d-flex" style="width: 100rpx;justify-content: flex-end;">
				<image @click.stop="NavigaMap()" style="width: 44rpx;height: 44rpx;" :src="imageUrl + 'map.png'">
				</image>
			</view> -->
		</view>

		<!-- 轮播 -->
		<!-- <view class="swiper-box" style="padding: 10rpx 30rpx 10rpx 30rpx;">
			<swiper class="swiper" style="border-radius: 20rpx;overflow: hidden;" circular indicator-dots autoplay
				indicator-color="rgba(255,255,255,0.4)" indicator-active-color="#fff" :interval="interval"
				:duration="duration">
				<swiper-item style="width: 690rpx;height: 260rpx;" v-for="(it,i) in bannerArr" :key="i">
					<view>
						<image style="width: 690rpx;height: 260rpx;border-radius: 20rpx;" :src="it.img_url"
							@click="pageurl(it.page_url)"></image>
					</view>
				</swiper-item>
			</swiper>
		</view> -->

		<view class="content">
			<map class="map" id="map" :latitude="latitude" :longitude="longitude" scale="16" show-location="true"
				:markers="covers" show-scale="true" @regionchange="regionchange">
				<image class="mapCenter" src="https://laundry02.zcsh-kj.com/upload/icon/sign_choose.png"
					mode="widthFix"></image>
			</map>
			<!-- <view class="dataBox">
				<view class="store">全国店铺 1352</view>
				<view class="store" style="border-left: 1upx solid #cecece;border-right: 1upx solid #cecece;">区域店铺 84
				</view>
				<view class="store" @click="aa()">附近店铺 16</view>
			</view> -->

		</view>

		<!-- 位置 -->
		<view class="address-box">
			<view class="add-now">{{userAddress}}</view>
			<view class="add-choose" @click="chooseAdd">地图选点</view>
		</view>

		<view class="cate_box">
			<view class="cate_item" v-for="(item,index) in cateLsit" :key="index" @click="cateNavicato(item)">
				<image class="cata_img" :src="item.img" mode="widthFix"></image>
				<text class="title">{{item.title}}</text>
			</view>
		</view>

		<!-- 展开更多店铺 -->
		<!-- <u-read-more :toggle="true" showHeight="200">
			<view class="open-box">
				<view class="open-more" v-for="(item,index) in covers" :key="index">
					<image class="store-img" :src="item.logo" mode="widthFix"></image>
					<view class="more-context">
						<view class="name">{{item.name}}</view>
						<view class="score">暂无评分</view>
						<view class="details">
							<text class="mcd">{{item.distance}}km</text>-
							<text class="mcd">{{item.full_address}}</text>
						</view>
					</view>
				</view>
			</view>
		</u-read-more> -->

		<!-- 常用功能 -->
		<view class="index-fun">
			<view class="index-box">
				<view class="box-list" v-for="(it, i) in funList" :key="i" @click="goPage(it, i)">
					<view class="box-list-left">
						<view class="">{{it.name}}</view>
						<view class="">{{it.text}}</view>
					</view>
					<view class="box-list-img">
						<u-image width="74rpx" height="74rpx" :src="imageUrl + it.img"></u-image>
					</view>
				</view>
			</view>
		</view>

		<view class="index-line">
			<view class="line-list" @click="youhuiquan">
				<view class="line-list-left d-flex">
					<u-image width="38rpx" height="28rpx" :src="imageUrl + 'index_yhq.png'"></u-image>
					<view class="line-title">优惠券</view>
				</view>
				<view class="line-list-right d-flex">
					<view class="line-text">查看全部优惠券</view>
					<view class="line-dot"></view>
					<u-icon name="arrow-right"></u-icon>
				</view>
			</view>
			<view class="line-list" @click="ordering">
				<view class="line-list-left d-flex">
					<u-image width="40rpx" height="40rpx" :src="imageUrl + 'index_order.png'"></u-image>
					<view class="line-title">进行中的订单</view>
				</view>
				<view class="line-list-right d-flex">
					<view class="line-text">查看订单</view>
					<view class="line-dot" v-if="orderNews.underway_order_id"></view>
					<u-icon name="arrow-right"></u-icon>
				</view>
			</view>
		</view>

		<lb-picker ref="picker" v-model="value2" mode="multiSelector" cancel-color="#9CA0A8" confirm-color="#347EF8"
			radius="30rpx" :list="addrValue" :level="3" :props="props" @confirm="handleConfirm">
		</lb-picker>

		<!-- 提醒会员过期 弹出层 -->
		<uni-popup ref="popup" type="center" :maskClick="false">
			<view class="pop-box">
				<view class="">
					<image class="pop-img" src="https://syxiyi.oss-cn-shenzhen.aliyuncs.com/frontend/img/vip_daoqi.png"
						mode=""></image>

					<view class="pop-cont">
						<view class="dq-word">您的会员卡即将到期，请留意剩余洗衣件数，尽快使用，会员到期将会清零！</view>
						<view class="dq-btn" @click="checkVip">查看会员详情</view>
					</view>
				</view>
				<view class="close-box">
					<image @click="close" class="close-img"
						src="https://syxiyi.oss-cn-shenzhen.aliyuncs.com/frontend/img/close_pop.png" mode=""></image>
				</view>
			</view>
		</uni-popup>

		<tab-bar :selected="0"></tab-bar>
	</view>
</template>

<script>
	import LbPicker from '@/components/lb-picker'
	import uniPopup from '@/components/uni-popup/uni-popup.vue'
	import QQMapWx from '../../common/qqmap-wx-jssdk.min.js'
	const qqmapSdk = new QQMapWx({
		key: 'EY4BZ-JCOEX-FSS4H-TRBUK-ILN4Q-HKFP4' // 在腾讯地图上申请的key
	})
	export default {
		components: {
			LbPicker,
			uniPopup
		},
		data() {
			return {
				value2: [],
				funList: [{
						name: '立即预约洗衣',
						text: '一键预约',
						img: 'index_yy.png',
						url: '/pages/yuyue/index'
					},
					{
						name: '洗衣结束待取',
						text: '点击查看详情',
						img: 'index_daiqu.png',
						url: '/pages/order/orderdetail/dnaq'
					},
				],
				navIndex: 0,
				imageUrl: 'https://syxiyi.oss-cn-shenzhen.aliyuncs.com/frontend/img/',
				address: '请选择地址',
				address_name: '',
				bannerArr: [],
				// interval: 3000,
				duration: 500,
				addrValue: [],
				cateLsit: [],
				props: {
					label: 'text',
					value: 'text',
					children: 'son'
				},
				store_id: '',
				orderNews: '',
				storeInfo: '',

				//地图数据
				// 地图经纬度
				id: 0, // 使用 marker点击事件 需要填写id
				title: 'map',
				latitude: '39.908816',
				longitude: '116.39747',
				width: 32,
				height: 32,
				covers: [],
				userAddress: '',
				check:0
			}
		},
		onReady() {
			// let lastPopupTime = uni.getStorageSync('lastPopupTime');
			// let now = Date.now();
			// let interval = now - lastPopupTime;
			// if (interval > 3600000) {
			// 	// 打开会员过期 弹出层
			// 	this.memberExpire()
			//     // 更新上次弹窗时间
			//     uni.setStorageSync('lastPopupTime', now);
			//   }
		},
		onLoad() {
			let loginstatus = uni.getStorageSync('token');
			
			if(loginstatus)
			{
				this.check = 1
				this.getIndexCate()
				this.getBanner()
				this.zidongLocation()
				this.getSchoolAddr()
			}else{
				uni.showModal({
					title:'请先登录',
					content:'登陆后体验更多功能',
					icon:'error'
				})
			}
			
			
		},
		onShow() {
			if(this.check)
			{
				this.getMapStore()
				this.getWeiDu()
			}
		},
		onPullDownRefresh() {
			if(this.check)
			{
				this.zidongLocation()
				this.getBanner()
				this.getSchoolAddr()
				this.getWeiDu()
				setTimeout(function() {
					uni.stopPullDownRefresh();
				}, 500);
			}
			
		},

		methods: {
			//测试
			aa() {
				uni.navigateTo({
					url: '/pages/index/map/map'
				})
			},
			
			//判断会员卡过期
			memberExpire(){
				this.$ajaxRequest.get(this.baseUrl + 'shop/index/IsMember', {
					uid:uni.getStorageSync('UserInfo').id
				}, true).then(res => {
					if(res.data.data>0 && res.data.data<=3){
						this.$refs.popup.open()
					}
				})
			},
			
			//首页分类点击带参跳转
			cateNavicato(item) {
				if(item.node == '#')
				{
					console.log('no change');
					uni.showToast({
						title:'暂未开放服务',
						icon:'error'
					})
				}else{
					uni.navigateTo({
						url: item.node
					})
				}
				
			},
			//自动定位 // 腾讯SDK自动获取定位方法
			zidongLocation() {
				let self = this
				uni.getLocation({
					type: 'gcj02',
					success: (res) => {
						console.log('测试')
						qqmapSdk.reverseGeocoder({
							location: {
								latitude: res.latitude,
								longitude: res.longitude
							},
							sig: 'cxo8vkcNccIK7t2T4WvMlWTHGDJ0VGoK', // 这个sig就是上面要准备的第二项SK
							success: (dd) => {
								self.userAddress = dd.result.formatted_addresses.recommend
								self.latitude = res.latitude
								self.longitude = res.longitude
								//缓存用户地理信息
								uni.setStorage({
									key: 'userOpsition',
									data: {
										latitude: res.latitude,
										longitude: res.longitude,
										userAddress: dd.result.formatted_addresses
									},
									success: function(res) {}
								})
							},
							fail: (err) => {
								console.log('获取城市失败')
							}
						})
					},
					fail: (err) => {
						if (err.errMsg === 'getLocation:fail:ERROR_NOCELL&WIFI_LOCATIONSWITCHOFF' || err
							.errMsg === 'getLocation:fail system permission denied') {
							uni.showModal({
								content: '请开启手机定位服务',
								showCancel: false
							})
						} else if (err.errMsg === 'getLocation:fail:system permission denied') {
							uni.showModal({
								content: '请给微信开启定位权限',
								showCancel: false
							})
						}
					}
				})
			},
			
			//地图移动选择时 获取中心数据
			regionchange(e) {
				if (e.type === 'end') { //在安卓中是 end 事件
					this.getCenterLatLong() // 地图移动时获取中心点的经纬度
				} else if (e.type === 'regionchange') { // 在ios中是 regionchange
					this.getCenterLatLong()
				}
			},
			
			//获取中心点位置
			getCenterLatLong() {
				let mapObjs = uni.createMapContext('map', this) // 得到map实例对象
				mapObjs.getCenterLocation({
					success: res => {
						const latitude = res.latitude
						const longitude = res.longitude
						qqmapSdk.reverseGeocoder({
							location: latitude ? `${latitude},${longitude }` : '',
							sig: 'cxo8vkcNccIK7t2T4WvMlWTHGDJ0VGoK', // 这个sig就是上面要准备的第二项SK
							success: (val) => {
								this.latitude = val.result.location.lat
								this.longitude = val.result.location.lng
								this.userAddress = val.result.formatted_addresses.recommend
								//缓存用户地理信息
								uni.setStorage({
									key: 'userOpsition',
									data: {
										latitude: val.result.location.lat,
										longitude: val.result.location.lng,
										userAddress: val.result.formatted_addresses
											.recommend
									},
									success: function(res) {}
								})
							},
							fail: (err) => {
								console.log('获取城市失败')
							}
						})
					},
					fail: res => {
						console.log('p1111:', res)
					}
				})
			},
			
			//点击轮播图跳转
			pageurl(e) {
				uni.navigateTo({
					url: e,
				})
			},
			
			//关闭会员过期 弹出层
			close() {
				this.$refs.popup.close()
			},
			//会员过期弹出层 查看会员详情
			checkVip() {
				uni.navigateTo({
					url: '/pages/vip/index'
				})
			},
			// 获取轮播图 
			getBanner() {
				this.$ajaxRequest.get(this.baseUrl + 'shop/index/banner', {}, true).then(res => {
					if (res.data.code == 200) {
						this.bannerArr = res.data.data
					} else {
						uni.showToast({
							title: res.data.msg,
							icon: 'none'
						})
					}
				})
			},
			//附近学校定位
			getSchoolAddr() {
				let self = this
				wx.getSystemInfo({
					success(res) {
						if (res.locationEnabled == false) {
							uni.showModal({
								title: '请先开启手机GPS定位,然后刷新',
								content: '否则将不能定位到您的位置'
							})
						} else {
							uni.removeStorageSync('store_id');
							uni.removeStorageSync('store_name');
							uni.getLocation({
								type: 'wgs84',
								success: function(res) {
									self.$ajaxRequest.get(self.baseUrl + 'shop/index/school', {
										lng: res.longitude,
										lat: res.latitude
									}, false).then(res => {
										console.log('附近学校定位',res)
										if (res.data.code == 200) {
											self.address = res.data.data.full_address
											self.address_name = res.data.data.name
											self.store_id = res.data.data.id
											self.storeInfo = res.data.data
											uni.setStorageSync('store_id', res.data.data.id)
											uni.setStorageSync('store_name', res.data.data.name)
										} else {
											uni.removeStorageSync('store_id');
											uni.removeStorageSync('store_name');
											uni.showModal({
												title: res.data.msg,
												success: function(res) {
													if (res.confirm) {
														console.log('用户点击确定');
													} else if (res.cancel) {
														console.log('用户点击取消');
													}
												}
											});
										}
									})
								}
							});
						}
					}
				})
			},
			//手动选择地点
			chooseAdd() {
				let that = this
				uni.chooseLocation({
					success: function(res) {
						that.latitude = res.latitude
						that.longitude = res.longitude
						that.userAddress = res.name
						
						uni.removeStorageSync('store_id');
						uni.removeStorageSync('store_name');
						that.$ajaxRequest.get(that.baseUrl + 'shop/index/school',{
							lng:res.longitude,
							lat:res.latitude
						},false).then(res=>{
							console.log('定点附近门店',res.data);
							if(res.data.code == 200)
							{
								that.address = res.data.data.full_address
								that.address_name = res.data.data.name
								that.store_id = res.data.data.id
								that.storeInfo = res.data.data
								uni.setStorageSync('store_id',res.data.data.id)
								uni.setStorageSync('store_name',res.data.data.name)
							}else{
								that.address = ''
								that.address_name = '附近无门店'
								uni.removeStorageSync('store_id');
								uni.removeStorageSync('store_name');
								uni.showModal({
									title: res.data.msg,
									success: function(res) {
										if (res.confirm) {
											console.log('用户点击确定');
										} else if (res.cancel) {
											console.log('用户点击取消');
										}
									}
								});
							}
						})

						//缓存用户的地理信息
						uni.setStorage({
							key: 'userOpsition',
							data: {
								latitude: res.latitude,
								longitude: res.longitude,
								userAddress: res.name
							},
							success: function(res) {}
						})
						// that.getDistance(res.longitude, res.latitude, 113.904723, 23.561834)
					}
				});
			},
			// 注意：一键导航（未调用）
			daohang() {
				let self = this
				console.log(self.storeInfo)
				uni.openLocation({
					latitude: Number(self.storeInfo.lat),
					longitude: Number(self.storeInfo.lng),
					name: self.storeInfo.name,
					address: self.storeInfo.full_address,
					success: function() {
						console.log('success');
					}
				});
			},
			// 未读消息
			getWeiDu() {
				this.$ajaxRequest.get(this.baseUrl + 'shop/index/news', {}, true).then(res => {
					if (res.data.code == 200) {
						this.orderNews = res.data.data
					} else {
						uni.showToast({
							title: res.data.msg,
							icon: 'none'
						})
					}
				})
			},
			
			// 常用功能页面跳转
			goPage(it, i) {
				if (i == 0) {
					uni.navigateTo({
						url: it.url + '?store_id=' + this.store_id
					})
				} else {
					if (this.orderNews.end_order_id != 0) {
						uni.navigateTo({
							url: it.url + '?id=' + this.orderNews.end_order_id
						})
					} else {
						uni.showToast({
							title: '您还没有待取件订单哦',
							icon: 'none'
						})
					}
				}

			},

			// 优惠卷
			youhuiquan() {
				uni.navigateTo({
					url: '/pages/index/coupons/index?store_id=' + this.store_id
				})
			},
			// 进行中的订单
			ordering() {
				if (this.orderNews.underway_order_id != 0) {
					uni.navigateTo({
						url: '/pages/order/orderdetail/xyz?id=' + this.orderNews.underway_order_id
					})
				} else {
					uni.showToast({
						title: '您还没有进行中的订单哦',
						icon: 'none'
					})
				}
			},

			//地图门店信息
			getMapStore() {
				this.$ajaxRequest.get(this.baseUrl + 'shop/index/mapStore', {
					lat: this.latitude,
					lng: this.longitude
				}, true).then(res => {
					console.log(res, '门店信息')
					if (res.data.code == 200) {
						res.data.data.forEach((value, index) => {
							value["distance"] = value.distance;
							value["height"] = 32;
							value["width"] = 32;
							value["iconPath"] = "https://laundry02.zcsh-kj.com/upload/icon/sign.png";
						})
						this.covers = res.data.data
						console.log(this.covers, 'this.covers')
					} else {
						uni.showToast({
							title: res.data.msg,
							icon: 'none'
						})
					}
				})
			},

			//获取首页分类
			getIndexCate() {
				this.$ajaxRequest.get(this.baseUrl + 'shop/index/IndexCate', {}, true).then(res => {
					if (res.data.code == 200) {

						this.cateLsit = res.data.data
					} else {
						uni.showToast({
							title: res.data.msg,
							icon: 'none'
						})
					}
				})
			}
		}
	}
</script>

<style lang="scss">
	page {
		background-color: #FAFAFA;
	}

	.top-box {
		padding: 10rpx 30rpx 10rpx 30rpx;
		display: flex;
		align-items: center;
	}

	.address {
		max-width: 750rpx;
		font-size: 28rpx;
		font-family: PingFang SC;
		font-weight: bold;
		color: rgba(50, 50, 50, 1);
		line-height: 70rpx;
		padding-left: 10rpx;
	}

	.swiper-box {
		border-bottom: 1rpx solid #FAFAFA;
	}

	.swiper {
		width: 690rpx;
		height: 260rpx;
	}

	.address-box {
		width: 93%;
		padding: 20rpx 0;
		border-radius: 10rpx;
		background-color: #FFFFFF;
		display: flex;
		justify-content: space-between;
		box-shadow: 1rpx 5rpx 18rpx 1rpx rgba(108, 108, 108, 0.16);
		margin: 0 auto;
		margin-top: 50rpx;

		.add-now {
			color: #1AA034;
			margin-left: 10rpx;

		}

		.add-choose {
			margin-right: 10rpx;
			color: #616161;
		}
	}

	//首页分类
	.cate_box {
		display: flex;
		align-items: center;
		justify-content: center;
		flex-wrap: wrap;
		background-color: #fff;
		box-shadow: 1rpx 5rpx 18rpx 1rpx rgba(108, 108, 108, 0.16);
		width: 93%;
		margin: 0 auto;
		margin-top: 30rpx;
		text-align: center;

		.cate_item {
			// margin: 10 0rpx;
			margin: 10rpx 0;
			width: 18%;

			.cata_img {
				width: 50rpx;
				height: 50rpx;
			}

			.title {
				display: block;
			}
		}
	}

	// 展开更多
	.open-box {
		background-color: #fff;
		box-shadow: 1rpx 5rpx 18rpx 1rpx rgba(108, 108, 108, 0.16);
		width: 93%;
		margin: 0 auto;
		margin-top: 30rpx;

		.open-more {
			display: flex;
			align-items: center;
			padding: 20rpx;
			// border: 1px solid red;


			.store-img {
				width: 150rpx;
				height: auto;
				border-radius: 20rpx;
			}

			.more-context {

				// border: 1px solid red;
				.name {
					color: #000000;
					font-size: 35rpx;
					// border: 1px solid red;
				}

				.score {
					font-size: 24rpx;
				}

				.details {
					// border: 1px solid red;
					font-size: 24rpx;

					.mcd {}
				}
			}
		}
	}

	.index-fun {
		padding: 50rpx 30rpx 40rpx;
	}

	.index-box {
		display: flex;
		justify-content: space-between;
		align-items: center;
	}

	.box-list {
		display: flex;
		justify-content: space-between;
		align-items: center;
		padding: 35rpx 20rpx 35rpx 20rpx;
		background: rgba(255, 255, 255, 1);
		box-shadow: 1rpx 5rpx 18rpx 1rpx rgba(108, 108, 108, 0.16);
		border-radius: 12rpx;
	}

	.box-list-left {
		padding-right: 32rpx;
	}

	.box-list-left>view:first-child {
		padding-bottom: 18rpx;
		font-size: 30rpx;
		color: #303030;
		font-weight: 700;
	}

	.box-list-left>view:last-child {
		font-size: 24rpx;
		color: #616161;
	}

	.index-line {
		padding: 0 30rpx;
	}

	.line-list {
		display: flex;
		justify-content: space-between;
		align-items: center;
		padding: 30rpx 0;
	}

	.line-title {
		font-size: 32rpx;
		color: #000000;
		padding-left: 30rpx;
	}

	.line-list-right {
		font-size: 28rpx;
		color: #A3A3A3;
	}

	.line-dot {
		width: 12rpx;
		height: 12rpx;
		background: rgba(255, 114, 59, 1);
		border-radius: 50%;
		margin-left: 13rpx;
		margin-right: 20rpx;
	}

	.pop-box {
		position: relative;
	}

	.pop-img {
		width: 640rpx;
		height: 588rpx;
	}

	.close-box {
		display: flex;
		justify-content: center;
		padding-top: 46rpx;
	}

	.close-img {
		width: 60rpx;
		height: 60rpx;
	}

	.pop-cont {
		position: absolute;
		top: 100rpx;
		left: 0;
		width: 100%;
		padding-left: 30rpx;
		padding-right: 20rpx;
		box-sizing: border-box;
	}

	.pop-qy {
		display: flex;
		justify-content: space-between;
		padding: 20rpx 0rpx;
		border-bottom: 1rpx solid #FBF8F9;
	}

	.qy-dot {
		top: 20rpx;
		width: 8rpx;
		height: 8rpx;
		background: rgba(255, 128, 62, 1);
		border-radius: 50%;
		margin-right: 25rpx;
		transform: translateY(15rpx);
	}

	.qy-text {
		width: 556rpx;
		color: #575757;
	}

	.dq-word {
		width: 542rpx;
		text-align: center;
		font-size: 34rpx;
		color: #333;
		margin: auto;
		padding-top: 68rpx;
		padding-bottom: 86rpx;
		line-height: 50rpx;
		font-weight: 500;
	}

	.dq-btn {
		width: 360rpx;
		height: 90rpx;
		background: linear-gradient(-17deg, rgba(241, 220, 170, 1), rgba(236, 212, 152, 1));
		box-shadow: 1rpx 4rpx 10rpx 3rpx rgba(237, 214, 156, 0.39);
		border-radius: 10rpx;
		text-align: center;
		line-height: 90rpx;
		margin: auto;
		font-size: 30rpx;
		color: #6E442C;
		font-weight: 700;
	}

	@font-face {
		font-family: 'iconfont';
		src: url('data:application/font-woff2;charset=utf-8;base64,d09GMgABAAAAAARoAA0AAAAACUAAAAQUAAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAP0ZGVE0cGh4GVgCCWhEICoVUhEYLEgABNgIkAxgEIAWFCAdnG7gHyB6FTdkzVl5JErstnP+l/Cc67f3ZSbpBHbSeQicwKMA9WAhRa5v9P0y2ZDImU7cZpJu78AiGaDD/AT3+/3vHLZz2QG5rqgX03m3Mv/CfJ9L52LBPYScMKIqjH05btKYGtIRKtQF3JuKUh5UAEADXlkbIAHBnwMdm3KkJoAeYAAyROCEcwABUoAMqYDs7C5gAfJ5eLJEBRtXBzd9ha5qOBiP0uU0a6Fh8H4KBAAIIEiT4+UyWMmGbcDUAWjKGjbDnVZ43eG5zgOeh9rPeD7wveR/33gQihNAEkFSoAWD+HgLcmX5oAEAGAG4AZ8ApoBUAAHAAAAAAwzGEz67eeoO6Gx5odHHrc/Wp5doz640X9uvP40m79aIftLlxw64ja8po2/XrBBlkv3GDjLFeu0YGWq5eLSbizMWCvnD9erZ29Gofss9YY7brlq3yhuVcabBZ7PYyNTHRU6ebbNLwQea0GdP6FKfE9BpdKjMZzaeYYsNuYFq+ecmBiD4rju1a59Vz5trQpbZpK8x9Ziw39Jw602hdts7bap+zIyx69PLZc8z2GctWzTSA5ThXVd6MFcuWzcINsqcKaeAtLgRX3LeEyNu7mVY/dczBXfplw09Sp+KCzrS18+elHFnaiJYBihLQUrRZKdqwsYrSMrBN4Mo2gZRiMA1hTgQNAtqIzr+n9KNHJdg95ejRvL27spFqz1lMHf+8bMil5/FqMVNSWd8GNL48Ym2zTTsaNtwB0XMvcIOBg+4LBkMefCh3tzt/wzaGxhwgt/0xnfSN/t5JnYXqN766tYf0q40a18DASflStXt1Gvg3qNsxyXvI+eRGhSnNdasrl9TrGbagrTd51vR5Pbqm6DysBqBq9YtDd76k2vDTiS2ONCuzz79r40Lf+CR93eHNRxzYePpRtsue/Rt21/TVl55q6vk0MbtmqnO3pj24H9wPAAABCFY9n6smudb5Jus4po45cQwskgYDkDEAQDDcScGhPc+gs/MSuHwFpDIZ/EMAsk44AGAALS3AAYKH+wg3KmOHA0RmAcZJAUhkI0zcthhUdI6AmuwRaJVOo9k6npkOCZUGQCkAgLhpBIyLBJC46WbitomgYrIG1NxcAC2b16N1wlMIrcYUGVJ0Vf3TCal6JedIU6RQZp+utKC908C5Bf993xqpRITPBjrJkKWbfCkU+HOd3uT6qWSbDIoucpqFisqpAHve7iuWq5DV1Lx3oQxKP9fporsslXTVVSYhk6JIAaFZEWqGfFFTRCgW/kquDGm6KgfPJdou3bMqde2auUvGt8G4Vc39RZkD2eUPVqyW8srLLJmXk1angCOMkJkZVwH5ZaUTaDGTPIawMJKIk4rU7v2uTUpPKcpOKcwqu8kQZIdY2bBXcsp5ShUB') format('woff2');
		font-weight: normal;
		font-style: normal;
		font-display: swap;
	}

	.iconfont {
		font-family: "iconfont" !important;
		font-size: 16px;
		font-style: normal;
		-webkit-font-smoothing: antialiased;
		-moz-osx-font-smoothing: grayscale;
	}

	.icon-daohang:before {
		content: "\e640";
	}

	.icon-daohang1:before {
		content: "\e656";
	}

	.icon-daohang2:before {
		content: "\e634";
	}

	.icon-icon_daohang-copy:before {
		content: "\e624";
	}

	.icon-daohang3:before {
		content: "\e625";
	}

	/* 地图样式 */
	.content {
		flex: 1;
	}

	.map {
		flex: 1;
		width: 100%;
		height: 40vh;
	}

	.dataBox {
		position: absolute;
		top: 100upx;
		left: 100upx;
		z-index: 999;
		display: flex;
		align-items: center;
		background-color: #fff;
		border-radius: 30upx;
		height: 70upx;

		.store {
			padding: 0 20upx;
		}
	}

	.mapCenter {
		width: 35rpx;
		position: absolute;
		left: 50%;
		top: 45%;
		transform: translate(-50%, -50%);
	}
</style>
